<template>
    <div>
        <h1>代办事项</h1>
        <ul>
            <li v-for="item in all" :key="item._id" v-if="item.value">{{item.value}}</li>
        </ul>
    </div>
</template>

<script>
export default {
    data(){
        return{
            all:[]
        }
    },
    methods:{
        async getAllTodos(){
          /*
            一、关于箭头函数的复习
            1、箭头函数如果是一个形参小括号直接省略点 
            2、箭头函数的形参如果是一个解构对象，则不能省略小括号
            3、箭头函数体如果只有一个return，可以省略函数体的花括号和return
            二、使用async和await来完成

          */
          let {data}=await fetch('http://47.98.128.191:3000/todos/getTodos').then(value=>value.json())
          this.all=data
        }
    },
    created(){
        this.getAllTodos()
    }
}
</script>

<style>

</style>